<template>
  <div>
    <el-menu :router="true" background-color="#001529" text-color="#fff">
      <h1>蚂蚁金融后台管理系统</h1>
      <menus v-for="(item,index) in menuList" :key="index" :menu="item"></menus>
    </el-menu>
  </div>
</template>

<script>
import {get} from '../utils/http.js'
import Menu from './Menu'
export default {
  data(){
    return {
      menuList:[]
    }
  },
  mounted(){
    get('/menu').then((res)=>{
      if(res.success){
        this.menuList = res.data
      }
    })
  },
  components:{
    menus:Menu
  }
};
</script>

<style lang="less" scoped>
h1{
  position: fixed;
  left: 0;
  top: 0;
  width: 200px;
  z-index: 1500;
  color:#fff;
  box-sizing: border-box;
  font-size:16px;
  padding:10px 0 22px 15px;
  border-bottom: 1px solid #666;
  background-color: #001529;
}
.el-menu{
  width: 200px;
  padding-top: 60px;
}
</style>
